{{template "header.html" .}}
<div id="form-result-message">
    <div class="message success hide">文章已保存</div>
    <div class="message error hide">文章保存失败：<span></span></div>
</div>
<form class="form" id="article-edit-form" action="/admin/articles/add/" method="post">
    <div id="article-edit-title-item">
        <div class="container relative">
            <input id="article-edit-title" class="ipt" type="text" name="title" placeholder="文章标题" required="required"/>
            <button class="btn save absolute submit" type="submit" id="article-edit-submit">保存文章</button>
        </div>
    </div>
    <div id="article-edit-content-item">
        <div class="container">
            <textarea name="content" id="article-edit-content" placeholder="放开写吧！" autofocus="autofocus"></textarea>
        </div>
    </div>
    <div id="article-meta-item" class="item container">
        <p class="item">
            <label for="article-edit-slug">缩略名</label>
            <input class="ipt" id="article-edit-slug" type="text" required="required" name="slug"/><span class="r"></span>
            <label for="article-edit-category">分类</label>
            <select class="select" name="category" id="article-edit-category">
                <option value="-1">未分类</option>{{range .Categories}}
                <option value="{{.id}}">{{.title}}</option>{{end}}
            </select><span class="r"></span>
            <label for="article-edit-status">状态</label>
            <select class="select" name="status" id="article-edit-status">
                <option value="published">发布</option>
                <option value="archived">存档</option>
                <option value="draft">草稿</option>
            </select>
        </p>
        <div class="item clear">
            <label for="article-edit-desc" class="left">描述</label>
            <textarea class="ipt left" name="desc" id="article-edit-desc" rows="10"></textarea>
        </div>
    </div>
</form>
<script type="text/javascript" src="/admin/js/bootstrap-markdown.js"></script>
<script type="text/javascript" src="/admin/js/marked.js"></script>
<script type="text/javascript" src="/admin/js/jquery.autosize.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
        $("<link>").attr({ rel: "stylesheet",
            type: "text/css",
            href: "/admin/css/editor.css"
        }).appendTo("head");
        var $content = $('#article-edit-content');
        $content.markdown({
            onPreview: function (e) {
                return marked(e.getContent(),{
                    breaks:true
                });
            }
        });
        $content.autosize({append: "\n"});
        ajaxForm("#article-edit-form",function(json){
           if(json.res){
               setTimeout(function(){
                   window.location.href = "/admin/articles/edit/"+json.id+"/";
               },1000);
           }
        });
    });
</script>
</body>
</html>